feat(react): Add versioning for workspace libraries #19063

ndcunningham · 2023-09-07T20:47:49Z

This PR grants users the ability to add versioning for their workspace libraries.

At build time inside withModuleFederation get each workspace library's version by:

Looking at the parent's package.json to get the version range
If not found in the root we look at the library's package.json to get the fixed version
If neither is found, we do not do any versioning and the functionality remains as is currently.

If the need arises where you do not want this functionality (since it is the current default) you can override it by using the shared API inside of the module-federation.config.js.

When your code is built you can check the build artifact's remoteEntry.js for your host/remote and you should see your workspace library registered with a version.

vercel · 2023-09-07T20:47:52Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

1 Ignored Deployment

Name	Status	Preview	Comments	Updated (UTC)
nx-dev	⬜️ Ignored (Inspect)	Visit Preview		Sep 13, 2023 7:50pm

nx-cloud · 2023-09-07T20:52:01Z

☁️ Nx Cloud Report

CI is running/has finished running commands for commit 240d0a2. As they complete they will appear below. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this branch

✅ Successfully ran 8 targets

Sent with 💌 from NxCloud.

Coly010 · 2023-09-08T09:39:03Z

I'm not sure this is the correct approach.

When we run the build of a remote or host, the ModuleFederationPlugin will read the package.json of the workspace libraries, if it exists, and set the version in its register function to that version. If it doesn't exist it sets it to 0.0.0.

We do set requiredVersion: false in the shareWorkspaceLibraries config. Instead, we should potentially switch this to be

requiredVersion: workspaceLib.packageJson?.version ?? false

Then the user can define a range of versions of the library that the app is compatible with in their shared function in the module-federation.config if they desire, otherwise, we'll have it pinned to the version of the library at the time the app was built:

shared: (libraryName, libraryConfig) => {
  if(libraryName === '@acme/mylib') {
     return {
         ...libraryConfig,
        requiredVersion: "~1.0.0"
  } 
}

If their workspace library does not have a package.json file, they can add one with just "version": "1.0.0" .

I tested this out locally, and it does work. If the remote and the host have different versions set in their shared function, then they just use their own version, otherwise, it uses a shared version between them.

This should also reduce the need of an additional property in the config.

packages/webpack/src/utils/module-federation/share.ts

e2e/react-core/src/react-module-federation.test.ts

jaysoo · 2023-09-12T13:26:58Z

packages/webpack/src/utils/module-federation/share.spec.ts

@@ -371,6 +373,80 @@ describe('MF Share Utils', () => {
      ).not.toThrow();
    });
  });
+
+  it('should using shared library version from root package.json if available', () => {


Maybe a clean-up item later, but it'd be nice to use either a real fs, or mem-fs here. Spying and mocking like this couples the test to the implementation too much. For example, if existsSync and realTsPathMappings are replaced with something else we'd have to update unit tests.

mem-fs can be used like:

import 'nx/src/utils/testing/mock-fs'; import { vol } from 'memfs'; // ... vol.fromJson({ 'tsconfig.base.json': { ... }, // ... }, '/');

This is probably a cleanup task. If we are changing over to use this it would make sense to update all the unit test inside share.spec.ts

packages/webpack/src/utils/module-federation/share.ts

Coly010

LGTM! 🎉

in a follow up task we should add or change the e2e to build the shell, then change the version of the lib, then build the remote.

then we should read the main.js file of the shell to find the version the library is being registered with by MFP, and check it is at the earlier version, and then we should look for the same line in the remote’s remoteEntry.mjs and check its version matches the new version.

github-actions · 2023-09-20T00:07:21Z

This pull request has already been merged/closed. If you experience issues related to these changes, please open a new issue referencing this pull request.

ndcunningham self-assigned this Sep 7, 2023

vercel bot deployed to Preview September 7, 2023 20:53 View deployment

ndcunningham force-pushed the feat/module-federation-lib-version branch from f3c2932 to 78f1c8d Compare September 8, 2023 16:55

vercel bot deployed to Preview September 8, 2023 17:02 View deployment

ndcunningham force-pushed the feat/module-federation-lib-version branch 4 times, most recently from e323d61 to 95e1e99 Compare September 11, 2023 21:29

ndcunningham marked this pull request as ready for review September 11, 2023 21:30

ndcunningham requested review from jaysoo, Coly010 and a team as code owners September 11, 2023 21:30

Coly010 reviewed Sep 11, 2023

View reviewed changes

packages/webpack/src/utils/module-federation/share.ts Outdated Show resolved Hide resolved